<template>
    <el-container class="el-container" style="height: 100%">
        <el-aside class="el-aside" style="width: 200px;">
                    <el-menu
                            default-active="2"
                            class="el-menu-vertical-demo"
                            @open="handleOpen"
                            @close="handleClose"
                            background-color="#545c64"
                            text-color="#fff"
                            active-text-color="#ffd04b"
                            :router=this.$route>
                        <el-submenu index="/image">
                            <template slot="title">
                                <i class="el-icon-location"></i>
<!--                                <span><router-link to="/image">上传文件</router-link></span>-->
                                <span>上传文件</span>
                            </template>
                            <el-menu-item-group>
<!--                                <template slot="title"><router-link to="/edit">处理图片</router-link></template>-->
                                <el-menu-item index="/image">处理图片</el-menu-item>
                                <el-menu-item index="1-2">选项2</el-menu-item>
                            </el-menu-item-group>
<!--                            <el-menu-item-group title="分组2">-->
<!--                                <el-menu-item index="1-3">选项3</el-menu-item>-->
<!--                            </el-menu-item-group>-->
<!--                            <el-submenu index="1-4">-->
<!--                                <template slot="title">选项4</template>-->
<!--                                <el-menu-item index="1-4-1">选项1</el-menu-item>-->
<!--                            </el-submenu>-->
                        </el-submenu>
                        <el-menu-item index="/directory">
                            <i class="el-icon-menu"></i>
<!--                            <span slot="title"><router-link to="/directory">上传文件夹</router-link></span>-->
                            <span slot="title">上传文件夹</span>
                        </el-menu-item>
                        <el-menu-item index="/video">
                            <i class="el-icon-document"></i>
<!--                            <span slot="title"><router-link to="/video">处理视频</router-link></span>-->
                            <span slot="title">处理视频</span>
                        </el-menu-item>
                        <el-menu-item index="4">
                            <i class="el-icon-setting"></i>
                            <span slot="title">历史记录</span>
                        </el-menu-item>
                    </el-menu>
        </el-aside>
        <el-main>
            <router-view></router-view>
        </el-main>
    </el-container>

</template>

<script>
    export default {
        name: "Nav"
    }
</script>

<style scoped>
    .el-aside{
        background-color: #545c64;
    }
    .el-container {
        background-color: #545c64;
    }
    .el-submenu .el-menu-item {
        min-width: 100px;
    }
</style>